import Taro, {Component,} from '@tarojs/taro'
import {View,Text} from '@tarojs/components'
import "./cell.css"
import {connect} from '@tarojs/redux'
import {
  set_userinfo, set_cart, set_goodslist, set_viplist, set_bind_car_num, set_progress,
  set_pushdata, set_pushdatanum, gohome_btn, set_cart_num,set_Device_set
} from '../../actions/IndexAction'
import { AtIcon } from 'taro-ui'
class DeviceCell extends Component {
  constructor(props) {
    super(props)
    this.state = {

    }
  }
  componentDidShow() {



  }
  changeChecked(parentKey,key,checked) {
    this.props.device_set.list[parentKey].data[key].checked = checked==1?0:1;
    this.props.dispatch(set_Device_set([].concat(this.props.device_set.list),false))
  }

  render() {
    const {parentKey} = this.props
    return (
      <View >
        {this.props.device_set&&this.props.device_set.list&&this.props.device_set.list[parentKey]&&this.props.device_set.list[parentKey].data&&this.props.device_set.list[parentKey].data.length>0&&this.props.device_set.list[parentKey].data.map((item,key)=>{
          console.log(item.checked)
            return(<View onClick={this.changeChecked.bind(this,parentKey,key,item.checked)} key={key} style={{padding: "10rpx", display: "flex",flexWrap:"warp",flexDirection:"row"}}>
              <View style={{width:"1000rpx",padding: "10rpx", borderBottom: "solid 2rpx #f0f2f5",display:"flex"}}>
                <View style={{flex: 1, display: "flex", alignItems: "center"}}>
                  <View style={{flex: 1, display: "flex", alignItems: "center"}}>

                    <Text style={{fontSize: "24rpx", color: "#666666"}}>{item.name}</Text>
                  </View>
                  <View style={{width: "80rpx", display: "flex", alignItems: "center"}}>
                    <AtIcon prefixClass='icon' value={item.checked==1?'checkbox-circle-fill':'checkbox-blank-circl'} size='24' color={item.checked==1?'#4bb33d':'#666666'}></AtIcon>
                  </View>
                </View>
              </View>
            </View>)
          })
        }
      </View>
    )
  }
}


const mapstate = state => {
  return {
    userinfo: state.usermodel,
    cart_num: state.cart_num,
    cart: state.cart,
    goodslist: state.goodslist,
    vip: state.vip,
    progress: state.progress,
    pushdata: state.pushdata,
    wxuser: state.wxusermodel,
    gytoken:state.gytoken,
    device_set:state.device_set
  }
}
export default connect(mapstate)(DeviceCell)